<template>
	<view class="content">
		<image class="logo" src="/static/logo.png"></image>
		<view class="text-area">
			<text class="title">{{title}}</text>
		</view>
		<!-- 微信登录按钮（仅在微信小程序环境显示） -->
		<!-- #ifdef MP-WEIXIN -->
		<!-- <button class="login-btn" @click="wxLogin" v-if="!isLoggedIn">
			<text class="btn-icon">👤</text>
			<text>微信登录</text>
		</button>
		<view class="login-status" v-else>
			<text class="status-icon">✓</text>
			<text class="status-text">已登录</text>
		</view>
		<button class="logout-btn" @click="logout" v-if="isLoggedIn">
			<text>退出登录</text>
		</button> -->
		<!-- #endif -->
		<button class="login-btn" @click="goToWorkout">进入健身锻炼页面</button>
		<button class="tarot-btn-a" @click="goToTarotA">进入塔罗牌A（扇形版）</button>
		<button class="tarot-btn-b" @click="goToTarotB">进入塔罗牌B（横向版）</button>
		<button class="emotion-test-btn" @click="goToEmotionTest">进入感情测试答题版</button>
	</view>
</template>

<script>
	import { initDynamicDomain } from '@/config/api.js';
	
	export default {
		data() {
			return {
				title: 'Hello',
				isLoggedIn: false // 登录状态
			}
		},
		async onLoad() {
			// 初始化动态域名
			await initDynamicDomain();
			
			// 检查登录状态
			this.checkLoginStatus();
		},
		// 转发给朋友
		onShareAppMessage(res) {
			return {
				title: '健身锻炼助手 - 科学管理你的训练计划',
				path: '/pages/index/index',
				imageUrl: '/static/logo.png'
			}
		},
		// 分享到朋友圈
		onShareTimeline() {
			return {
				title: '健身锻炼助手 - 科学管理你的训练计划',
				query: '',
				imageUrl: '/static/logo.png'
			}
		},
		methods: {
			// 检查登录状态
			checkLoginStatus() {
				const loginInfo = uni.getStorageSync('loginInfo');
				if (loginInfo && loginInfo.code) {
					this.isLoggedIn = true;
					console.log('用户已登录');
				} else {
					this.isLoggedIn = false;
					console.log('用户未登录');
				}
			},
			// 微信登录
			wxLogin() {
				// #ifdef MP-WEIXIN
				uni.showLoading({
					title: '登录中...'
				});
				
				// 调用微信登录接口获取code
				// 注意：根据微信最新规范，getUserProfile已废弃
				// 如需用户头像昵称，应使用 open-type="chooseAvatar" 和 type="nickname"
				uni.login({
					provider: 'weixin',
					success: (loginRes) => {
						console.log('登录成功，code:', loginRes.code);
						
						// 调用后端接口，使用code换取openid
						this.getOpenId(loginRes.code);
					},
					fail: (err) => {
						console.error('登录失败:', err);
						uni.hideLoading();
						uni.showToast({
							title: '登录失败，请重试',
							icon: 'none'
						});
					}
				});
				// #endif
			},
			// 获取openid
			getOpenId(code) {
				// #ifdef MP-WEIXIN
				// TODO: 请替换为您的后端API地址
				const apiUrl = 'https://your-backend-api.com/api/wechat/login';
				
				uni.request({
					url: apiUrl,
					method: 'POST',
					data: {
						code: code
					},
					success: (res) => {
						if (res.statusCode === 200 && res.data.openid) {
							console.log('获取openid成功:', res.data.openid);
							
							// 保存登录信息到本地存储
							const loginInfo = {
								code: code,
								openid: res.data.openid,
								sessionKey: res.data.session_key || '',
								loginTime: new Date().getTime()
							};
							
							uni.setStorageSync('loginInfo', loginInfo);
							this.isLoggedIn = true;
							
							uni.hideLoading();
							uni.showToast({
								title: '登录成功！',
								icon: 'success',
								duration: 2000
							});
						} else {
							console.error('获取openid失败:', res.data);
							uni.hideLoading();
							uni.showToast({
								title: '登录失败，请重试',
								icon: 'none'
							});
						}
					},
					fail: (err) => {
						console.error('请求后端接口失败:', err);
						uni.hideLoading();
						uni.showToast({
							title: '网络错误，请重试',
							icon: 'none'
						});
					}
				});
				// #endif
			},
			// 退出登录
			logout() {
				// #ifdef MP-WEIXIN
				uni.showModal({
					title: '提示',
					content: '确定要退出登录吗？',
					success: (res) => {
						if (res.confirm) {
							// 清除本地存储的登录信息
							uni.removeStorageSync('loginInfo');
							// 更新登录状态
							this.isLoggedIn = false;
							// 显示提示
							uni.showToast({
								title: '已退出登录',
								icon: 'success',
								duration: 2000
							});
							console.log('用户已退出登录');
						}
					}
				});
				// #endif
			},
			goToWorkout() {
				uni.navigateTo({
					url: '/pages/workout/workout'
				})
			},
			goToTarotA() {
				uni.navigateTo({
					url: '/pages/tarot-a/tarot-a'
				})
			},
			goToTarotB() {
				uni.navigateTo({
					url: '/pages/tarot-b/tarot-b'
				})
			},
			goToEmotionTest() {
				uni.navigateTo({
					url: '/pages/emotion-test/emotion-test'
				});
			}
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
	
	/* 微信登录按钮 */
	.login-btn {
		margin-top: 40rpx;
		width: 80%;
		height: 88rpx;
		line-height: 88rpx;
		background-color: #07C160;
		color: #FFFFFF;
		font-size: 32rpx;
		border-radius: 16rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		border: none;
	}
	
	.login-btn::after {
		border: none;
	}
	
	.btn-icon {
		font-size: 36rpx;
		margin-right: 12rpx;
	}
	
	/* 退出登录按钮 */
	.logout-btn {
		margin-top: 40rpx;
		width: 80%;
		height: 88rpx;
		line-height: 88rpx;
		background-color: #FF3B30;
		color: #FFFFFF;
		font-size: 32rpx;
		border-radius: 16rpx;
		border: none;
	}
	
	.logout-btn::after {
		border: none;
	}
	
	/* 登录状态显示 */
	.login-status {
		margin-top: 40rpx;
		width: 80%;
		height: 88rpx;
		background-color: #F0F0F0;
		border-radius: 16rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	
	.status-icon {
		font-size: 36rpx;
		color: #07C160;
		margin-right: 12rpx;
	}
	
	.status-text {
		font-size: 32rpx;
		color: #666666;
	}
	
	/* 进入健身锻炼页面按钮 */
	.nav-btn {
		margin-top: 40rpx;
		width: 80%;
		height: 88rpx;
		line-height: 88rpx;
		background-color: #007AFF;
		color: #FFFFFF;
		font-size: 32rpx;
		border-radius: 16rpx;
	}
	
	/* 塔罗牌A按钮 */
	.tarot-btn-a {
		margin-top: 40rpx;
		width: 80%;
		height: 88rpx;
		line-height: 88rpx;
		background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
		color: #FFFFFF;
		font-size: 32rpx;
		border-radius: 16rpx;
		border: none;
		box-shadow: 0 4rpx 15rpx rgba(102, 126, 234, 0.4);
	}
	
	.tarot-btn-a::after {
		border: none;
	}
	
	/* 塔罗牌B按钮 */
	.tarot-btn-b {
		margin-top: 40rpx;
		width: 80%;
		height: 88rpx;
		line-height: 88rpx;
		background: linear-gradient(135deg, #1e3c72 0%, #2a5298 100%);
		color: #FFFFFF;
		font-size: 32rpx;
		border-radius: 16rpx;
		border: none;
		box-shadow: 0 4rpx 15rpx rgba(30, 60, 114, 0.4);
	}
	
	.tarot-btn-b::after {
		border: none;
	}
	
	/* 感情测试按钮 */
	.emotion-test-btn {
		margin-top: 40rpx;
		width: 80%;
		height: 88rpx;
		line-height: 88rpx;
		background: linear-gradient(135deg, #FF6B6B 0%, #FF8E8E 100%);
		color: #FFFFFF;
		font-size: 32rpx;
		border-radius: 16rpx;
		border: none;
		box-shadow: 0 4rpx 15rpx rgba(255, 107, 107, 0.4);
	}
	
	.emotion-test-btn::after {
		border: none;
	}
</style>
